import Vue from 'vue'
import App from './App.vue'

import VueRouter from 'vue-router'

import './css/base.css'

import find from './views/find.vue'
import my from './views/my.vue'
import part from './views/part.vue'
import notFind from './views/notFind.vue'

import Ranking from './views/finds/ranking.vue'
import Recommend from './views/finds/recommend.vue'
import Songlist from './views/finds/songlist.vue'

import Collect from './views/mys/collect.vue'
import Like from './views/mys/like.vue'
import Recently from './views/mys/recently.vue'

// 三级嵌套
import Fashion from './views/mys/likes/fashion.vue'
import Retro from './views/mys/likes/retro.vue'
import Scriptures from './views/mys/likes/scriptures.vue'


Vue.config.productionTip = false

Vue.use(VueRouter)

const routes = [
  { path: '/', redirect: '/find/recommend' },
  { 
    name:'my', 
    path: '/my', 
    component: my ,
    children: [
      { name:'Collect', path: 'collect', component: Collect },
      { 
        name:'Like', 
        path: 'like', 
        component: Like ,
        children: [
          { name:'Fashion', path: 'fashion', component: Fashion },
          { name:'Retro', path: 'retro', component: Retro },
          { name:'Scriptures', path: 'scriptures', component: Scriptures },
        ]
      },
      { name:'Recently', path: 'recently', component: Recently },
    ]
  },
  { name:'part', path: '/part', component: part },
  // { name:'part', path: '/part/:name/:age', component: part },
  {
    name: 'find',
    path: '/find',
    component: find,
    children: [
      { name:'Ranking', path: 'ranking', component: Ranking },
      { name:'Recommend', path: 'recommend', component: Recommend },
      { name:'Songlist', path: 'songlist', component: Songlist },
    ]
  },
  { name:'notFind', path: '*', component: notFind }
]
const router = new VueRouter({
  routes,
  mode: 'history'
})

const token = true
router.beforeEach((to,from,next) => {
  if (!token && to.path == '/my') {
    alert('请登录')
    next(false)
    return
  }
  next()
})
new Vue({
  render: h => h(App),
  router
}).$mount('#app')
